<script setup lang="ts">

</script>

<template>
  <el-card class="box-card">
    <h1 style="text-align: center">环境空气和废气 硫酸雾样品前处理记录表格（B面）</h1>
    <table class="table">
      <tr>
        <td style="width: 11%;" colspan="2">任务编号</td>
        <td style="width: 11%;" colspan="3">
          <el-input style="width: 150px;border: 1px solid transparent" />
        </td>
        <td style="width: 11%;" colspan="3">测试项目</td>
        <td style="width: 11%;" colspan="4">
          <el-input style="width: 150px;border: 1px solid transparent" />
        </td>
        <td style="width: 11%;" colspan="3">样品类别</td>
        <td style="width: 12%;" colspan="4">
          <el-input style="width: 150px;border: 1px solid transparent" />
        </td>
      </tr>
      <tr>
        <td style="width: 10%;" colspan="2">前处理方法依据</td>
        <td colspan="15"></td>
      </tr>
      <tr>
        <td colspan="16" style="border-bottom: none;">超声波萃取法</td>
      </tr>
      <tr>
        <td style="height: 500px;border-top: none;" colspan="16">
          <el-input style="width: 1000px;border: 1px solid transparent" />
        </td>
      </tr>
      <tr>
        <td colspan="16" style="border-bottom: none;">加热浸出法</td>
      </tr>
      <tr>
        <td style="height: 500px;border-top: none;" colspan="16">
          <el-input style="width: 1000px;border: 1px solid transparent" />
        </td>
      </tr>
  
    </table>
  </el-card>
</template>

<style scoped lang="scss">
.card {
  padding: 20px 25px;
}

.table {
  width: 100%;
  border-collapse: collapse;
  /* 表格边框合并 */
  text-align: left;
  /* 默认左对齐 */
  font-size: 14px;
  /* 字体大小 */
  color: #606266;
  /* 默认字体颜色 */
  margin-bottom: 20px;
}

.table th,
.table td {
  border: 1px solid #c2bfbf;
  /* 表格单元格边框颜色 */
  padding: 12px;
  /* 单元格内边距 */
}

.table th {
  background: #f5f7fa;
  /* 表头背景色 */
  font-weight: 600;
  /* 表头字体加粗 */
  color: #303133;
  /* 表头字体颜色 */
  text-align: center;
  /* 表头居中 */
}

.table td {
  width: 15%;
}

.table-td {
  display: flex;
}

::v-deep .el-input__wrapper {
  background-color: transparent;
  box-shadow: none;
}

::v-deep .el-select__wrapper {
  background-color: transparent;
  box-shadow: none;
}

::v-deep .el-input-group__append {
  background-color: transparent;
  box-shadow: none;
}
</style>
